{{extend 'layout.html'}}
<br/>
<br/>
<div> 
	<form method="post" enctype="multipart/form-data" action="">
		<table>
			<tbody>		
				<tr id="project_code__row">
					<td class="w2p_fl"><label id="project_code__label" for="project_code">Code: </label></td>
					<td class="w2p_fw"><input value="{{=project.code}}" name="code" id="project_code" class="string"></td>
					<td class="w2p_fc"></td>
				</tr>
				<tr id="project_description__row">
					<td class="w2p_fl"><label id="project_description__label" for="project_description">Description: </label></td>
					<td class="w2p_fw"><input type="text" value="{{=project.description}}" name="description" id="project_description" class="string"></td>
					<td class="w2p_fc"></td>
				</tr>
				<tr id="project_source_language__row">
					<td class="w2p_fl"><label id="project_source_language__label" for="project_source_language">Source Language: </label></td>
					<td class="w2p_fw">												
						<select name="source_language" id='project_language_language'>
        					{{for l in languages:}}
        						{{if project.source_language==l.id:}}
            						{{=OPTION(l.description, _value=l.id, _selected='')}}
            					{{else:}}
            						{{=OPTION(l.description, _value=l.id)}}
            					{{pass}}
        					{{pass}}
     					</select>						
					</td>
					<td class="w2p_fc"></td>
				</tr>
				<tr id="submit_record__row">
					<td class="w2p_fl"></td>
					<td class="w2p_fw">
						<input type="submit" value="Submit">
					</td>
					<td class="w2p_fc"></td>
				</tr>
			</tbody>
		</table>
		<div class="hidden" style="display: none;">
			<input type="hidden" value="{{=project.id}}" name="id">
			<input type="hidden" value="project_update" name="_formname">			
		</div>
	</form>
</div>

<script type="text/javascript">
     $(document).ready(function(){
    	 $("#dialog-confirm").dialog({ autoOpen: false });         
	 });

	function delete_project_language(id) {	  
	 	  $("#dialog-confirm").dialog("open");
	 	  $("#dialog-confirm").dialog({
	 		  autoOpen: false,
	 		  modal:true,
	 		  buttons : {
	 			"Yes" : function() {              
	 				$(this).dialog("close");
	 				// get call:
	 				// window.location.href='../delete_project_language/' + id;
	 				$.ajax({
	 					type:'GET',
	 					url:"{{=URL('delete_project_language')}}",
	 					data: {'id':id},
	 					success: function(data) {
	 						$('#lang_table').html(data);						  		
	 				}});	 				
	 				return;
	 			},
	 			"No" : function() {
	 				$(this).dialog("close");
				}
			}
		});	  	  
	 }
</script>
<br/>
<div id="dialog-confirm" title="Confirm">
	{{=T('Are you sure you want to delete the language for this project with all its items?')}} 
</div>

<div id='main' style="margin-left:auto; margin-right:auto;">
	<table style="border-collapse: separate; border-spacing: 5px">
		<thead>
			<tr>
				<th></th>
	            <th></th>
	            <th></th>
			</tr>
		</thead>
		<tbody id='lang_table'></tbody>     
	</table>
<script>
$.ajax({
       type: "GET",
       url: "{{=URL('languages_by_project/%s' %project.id)}}",
       data: "",
       success: function(msg){
           $("#lang_table").html(msg);
       }
});
</script>
</div>
<br/>

<form id='add_language'>
     <select name="language" id='project_language_language'>
        {{for l in languages:}}
            {{=OPTION(l.description, _value=l.id)}}
        {{pass}}
     </select>
     <input name='project' id='project_language_project' type="hidden" value="{{=project.id}}">
     <input name='tot_item' type="hidden" value="0">  
     <input name='tra_item' type="hidden" value="0">  
     <br/>
     <br/>
     <input type="submit" value="{{=T('Add')}}"/>
     <script>
        jQuery('#add_language').submit(function() {
            ajax('{{=URL('add_language')}}',
            ['language', 'project', 'tot_item', 'tra_item'], 'lang_table');
            return false;
        });
    </script>    
</form>
